<?php if (!defined('THINK_PATH')) exit();?><!-- <!-- <?php echo ($nickname); ?>
asdasdasdasdasdasd -->
<style type="text/css">

/* Apply these styles only when #preview-pane has
   been placed within the Jcrop widget */
.jcrop-holder #preview-pane {
  display: block;
  position: absolute;
  z-index: 2000;
  top: 10px;
  right: -280px;
  padding: 6px;
  border: 1px rgba(0,0,0,.4) solid;
  background-color: white;

  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;

  -webkit-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
}

/* The Javascript code will set the aspect ratio of the crop
   area based on the size of the thumbnail preview,
   specified here */
#preview-pane .preview-container {
  width: 250px;
  height: 250px;
  overflow: hidden;
}
.nickname{
	text-align: center;
	padding: 6px;
	font-size:20px;
	    color: #504d4d;
    font-weight: bold;
}

</style>

<!-- <link rel="stylesheet" type="text/css" href="/solve/Public/js/cropper/css/jquery.Jcrop.min.css"> -->
<link rel="stylesheet" type="text/css" href="/solve/Public/plugs/style.css">






<div  class="easyui-layout" data-options="fit:true"> 
     
 

    <div data-options="region:'west',title:'',split:true,border:false,split:false" style="width:150px;padding: 15px 5px 5px 20px;background:#e0ecff;">


		<?php if($avatar==''): ?><img src="/solve/Public/images/avata.png" class="account-avator-bg easyui-tooltip" title="点击上传头像" onclick="change_avatar()" /> <?php else: ?> <img src="/solve/Public/<?php echo ($avatar); ?>" class="account-avator-bg  easyui-tooltip" title="点击更换头像" onclick="change_avatar()"/><?php endif; ?>
		<div class="nickname"><?php echo ($nickname); ?></div>
    </div>   
    <div data-options="region:'center',title:'',border:false,split:false" style="padding:5px 5px 5px 0">
		<div id="user_info_tab" class="easyui-tabs" style="width:500px;height:250px;"  data-options="fit:true">   
		    <div title="用户信息" style="padding:20px;">   
		        <table>
					<tr>
						<td>用户名：</td>
						<td><?php echo ($username); ?></td>
					</tr>
					<tr>
						<td>昵称：</td>
						<td><?php echo ($nickname); ?></td>
					</tr>
					<tr>
						<td>用户组：</td>
						<td><?php echo ($_SESSION['zname']); ?></td>
					</tr>
					<tr>
						<td>E-Mail：</td>
						<td>
						<?php if($email!=''): echo ($email); ?>  <?php else: ?> 请尽快补全E-Mail信息，以便获得系统E-Mail模块功能！<?php endif; ?>
						</td>
					</tr>
					<tr>
						<td>签名：</td>
						<td>
						<?php if($sign==''): ?><span  title="点击上传签名" class="easyui-tooltip" onclick='change_signar()'>没有签名，请尽快上传签名，以便获得签名功能！</span><?php else: ?> <img onclick="change_signar()" src="/solve/Public/<?php echo ($sign); ?>" class="user_sign easyui-tooltip" title="点击更改签名"  style="width:100px;border: 2px solid #e2dbdb;"/><?php endif; ?>
						</td>
					</tr>
		        </table>   
		    </div>   
		    <div title="修改信息" data-options="" style="overflow:auto;padding:20px;"> 
<div  class="easyui-panel" title="用户信息修改"     
        style="width:100%;height:250px;padding:10px;background:#fafafa;"   
        data-options="iconCls:'icon-save',closable:false,    
                collapsible:true,minimizable:false,maximizable:false">   
   
		        <form id="user_info_editor" method="post">
		<input type="hidden" id="id" name="id" type="text"/>
		<table class="userform">
			<tr>
				<th>用户名:</th>
				<td>				
					<input id="username" name="username" type="text" data-options="" class="easyui-textbox" value="<?php echo ($username); ?>"/>
					
				</td>
			</tr>
			<tr>
				<th>昵称:</th>
				<td>				
					<input id="nickname" name="nickname" type="text" data-options="" class="easyui-textbox" value="<?php echo ($nickname); ?>"/>
					
				</td>
			</tr>
			<tr>
				<th>E-Mail:</th>
				<td>
					
					<input id="email" name="email" type="text" class="easyui-textbox" data-options="validType:'email'" value="<?php echo ($email); ?>"/>  
				</td>
			</tr>

			<tr>
				<th>密码：</th>
				<td>					
					<input  id="password" name="password" type="password" class="easyui-textbox" data-options="" />   &nbsp;&nbsp;（密码留空则表示不进行更改！）
				</td>
			</tr>
           <tr>
				<th>确认密码：</th>
				<td>					
					<input  id="repassword" name="repassword" type="password" class="easyui-textbox" />&nbsp;&nbsp;（密码留空则表示不进行更改！）
				</td>
			</tr>
		</table>
	</form> 
	<a href="#" id="user_info_edit_btn" class="easyui-linkbutton" data-options="iconCls:'icon-ok'">确认</a>
	<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" onclick="$('#user_info_editor').form('clear')">取消</a>
</div> 



		    </div>   
		    <div title="修改头像" data-options="iconCls:'icon-standard-drive-web'" style="padding:10px;display:none;"> 



		    		       	  <div class="container">

<div class="container">

  <div class="imageBox">

    <div class="thumbBox"></div>

    <div class="spinner" style="display: none"></div>

  </div>

  <div class="action"> 

    <!-- <input type="file" id="file" style=" width: 200px">-->

    <div class="new-contentarea tc"> <a href="javascript:void(0)" class="upload-img">

      <label for="upload-file">请先选择图片...</label>

      </a>

      <input type="file" class="" name="upload-file" id="upload-file" />


<input name="avatar" id="avatar_url" type="hidden"/> 


    </div>

    <input type="button"  id="btnCrop" class="Btnsty_peyton" value="OK">

    <input type="button" id="btnZoomIn" class="Btnsty_peyton" value="+"  >

    <input type="button" id="btnZoomOut" class="Btnsty_peyton" value="-" >

  </div>

  <div class="cropped"></div>

</div>

 
		</div> 






		    </div> 
		    <div title="上传签名" data-options="iconCls:'icon-standard-award-star-gold-3'" style="padding:20px;display:none;">   
		           <!-- <input id="file"  onchange="c()"   type="file"><br> -->
				
		请将上传的签名图片文件保持在1M以内！<br>
	
	<form id="upload_avatar_form" action="" enctype="multipart/form-data" method="post" >
		           <input  id="file"   name="sign"  style="width:650px;"  class="easyui-filebox" data-options="buttonText:'上传签名',buttonIcon:'icon-standard-application-edit',accept:'image/gif,image/jpeg,image/jpg,image/png,image/svg'"><br>
</form>

		           <img src="" id="show" width="200px">
<br>
	<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-standard-accept',iconAlign:'right'" onclick="upload_sign()">上传</a>
		    </div> 
		    <div title="用户记录" data-options="iconCls:'icon-standard-user-go'" style="padding:20px;display:none;">   
 		开发中，可以显示用户在本系统中的各种操作记录！
    </div>   
</div> 


<!-- <script type="text/javascript" src="/solve/Public/js/cropper/js/jquery.Jcrop.min.js"></script> -->

<script type="text/javascript" src="/solve/Public/plugs/cropbox.js"></script>
<script>


	function upload_sign(){
		$('#upload_avatar_form').form('submit', {

			url : APP+'/Admin/User/upload_sign',

			success : function(data) {
				
				var data = eval('(' + data + ')');
				$.messager.alert('添加项目', data.msg, 'info');
				

			}
		});
	}

$('#file').filebox({
//...
onChange : function(e) {
// file对象
// var file = $(this).next().find('input[id^="filebox_file_id_"]');
var file =$("input[name=sign]")[0].files[0];
if(file.size>1024000){
	$.messager.alert('上传签名', '签名图片不能大于 1 M', 'info');
	$('#file').filebox('clear');
}else{
var r= new FileReader();    
r.readAsDataURL(file);  
r.onload=function (e) {    
	document.getElementById('show').src=this.result; 
	 }
}

	;}

});

$(function(){




		//$('#btnCrop').click();$("#idName").css("cssText","background-color:red!important");

	

	//$(".imageBox").css("cssText","background-position:88px 88px!important");$(".imageBox").css("cssText","background-size:222px 222px!important");
	//
	if('<?php echo ($avatar); ?>'!=''){
		img=PUBLIC+'/<?php echo ($avatar); ?>';
	}else{
		img=PUBLIC+'/images/avata.png';
	}

	var options =

	{

		thumbBox: '.thumbBox',

		spinner: '.spinner',

		imgSrc: img

	}

	var cropper = $('.imageBox').cropbox(options);

	var img="";

	$('#upload-file').on('change', function(){

		var reader = new FileReader();

		reader.onload = function(e) {

			options.imgSrc = e.target.result;

			cropper = $('.imageBox').cropbox(options);

			getImg();

		}

		reader.readAsDataURL(this.files[0]);

		this.files[0] = [];

		//getImg();

	})

	$('#btnCrop').on('click', function(){


img = cropper.getDataURL();

$('#avatar_url').val(img);
	  $.post(APP+'/Admin/User/avatar', {
                            avatar : img
                        }, function(data) {
                            if (data.status==1) {
                                $.messager.alert('上传头像', data.msg, 'info');
                            
                               
                            } else {
                                $.messager.show({ // show error message  
                                    title : '错误',
                                    msg : data.msg
                                });

                            }
                        }, 'json');
	})

	function getImg(){

		img = cropper.getDataURL();

		$('.cropped').html('');

		$('.cropped').append('<img src="'+img+'" align="absmiddle" style="width:180px;margin-top:4px;border-radius:180px;box-shadow:0px 0px 12px #7E7E7E;"><p>180px*180px</p>');

		$('.cropped').append('<img src="'+img+'" align="absmiddle" style="width:128px;margin-top:4px;border-radius:128px;box-shadow:0px 0px 12px #7E7E7E;"><p>128px*128px</p>');

		$('.cropped').append('<img src="'+img+'" align="absmiddle" style="width:64px;margin-top:4px;border-radius:64px;box-shadow:0px 0px 12px #7E7E7E;" ><p>64px*64px</p>');

		}

		

	$(".imageBox").on("mouseup",function(){

 		getImg();

  		});

		

		

	$('#btnZoomIn').on('click', function(){

		cropper.zoomIn();

	})

	$('#btnZoomOut').on('click', function(){

		cropper.zoomOut();


	})







});

function change_avatar(){
	$('#user_info_tab').tabs('select','修改头像');
}

function change_signar(){
	$('#user_info_tab').tabs('select','上传签名');
}




</script>